<template>
    <div class="community-page">
        <Navigator :leftButton="'none'">
            <template v-slot:center>
                <div class="title">社区</div>
            </template>
            <template v-slot:right>
                <div class="btn-post" @click="toAddPostPage">
                    <img :src="require('@/assets/icon/newpost.png')" />
                </div>
            </template>
        </Navigator>

        <div v-for="(item, index) in postList" :key="index" class="lis">
            <div class="item">
                <PostItem :item="item" @delete="getPostList" />
            </div>
        </div>
    </div>
</template>

<script>
import PostItem from "@/pages/community/components/postItem/index";

export default {
    name: "Community",
    components: {
        PostItem
    },
    data() {
        return {
            postList: []
        };
    },

    created() {
        this.getPostList();
    },

    methods: {
        getPostList() {
            this.$cloudApi.getPosts().then(postList => {
                console.log("最新微博", postList);
                this.postList = postList;
            });
        },

        toAddPostPage() {
            this.$router.push({
                path: "/community/post"
            });
        }
    }
};
</script>


<style lang="less">
.community-page {
    box-sizing: border-box;
    width: 100vw;
    min-height: 100vh;
    padding: 130px 0 130px 0;
    background: #f5f5f5;

    .btn-post {
        width: 50px;
    }

    .navigator {
        box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
    }
}
</style>